import * as React from 'react'
import Button from 'antd/lib/button/button'
import Input from 'antd/lib/input/Input'
import { Col, Row } from 'antd/lib/grid'
import { Props, States } from '../typings/index'

interface ToDoInputProps extends Props {
  onInputChange: (e: React.ChangeEvent<HTMLInputElement>) => void
  handleAdd: () => void
  value: string
}

export default class TodoInput extends React.Component<ToDoInputProps, States> {
  constructor(props: ToDoInputProps) {
    super(props)
  }
  render() {
    return (
      <Row>
        <Col span={20} offset={1}>
          <Input placeholder="输入代办事项" onChange={this.props.onInputChange} onPressEnter={this.props.handleAdd} value={this.props.value} />
        </Col>
        <Col span={2} offset={1}>
          <Button type="primary" onClick={this.props.handleAdd}>
            添加
          </Button>
        </Col>
      </Row>
    )
  }
}
